<template> 
    <div class="msg-page clear-both">
        <!--<view class="msg-swiper">
            <swiper :indicator-dots="false"
            :autoplay="false" :interval="interval" :duration="duration">
            <block v-for="(item,index) in imgUrls"  :key="index">
                <swiper-item>
                    <image :src="item" class="slide-image"  />
                </swiper-item>
            </block>
            </swiper>
        </view>-->
        <div class="content" v-if="list.length!=0">
            <art-list v-for="(item,index) in list" :key="index" :item="item" @jumpDetail="jumpDetail" @shoucang="shoucang" ></art-list>
        </div>
        <div class="text-center data-null" v-else>暂无数据</div>
    </div> 
</template>

<script>
import artList from './tpl/art-list' 

export default {
    props: {
        list:{
            default:[],
            type:Array
        }
    },
    data () {
        return {
            imgUrls: [
                'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',
                'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg',
                'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'
            ],  
            interval: 5000,
            duration: 600
        }
    },
    methods:{
        jumpDetail(item){
            this.$emit('jumpDetail',item);
        },
        shoucang(val,list){  
            let vm = this; 
            if(val=='add'){ 
                vm.$emit('shoucang','add',list);
            }else{
                vm.$emit('shoucang','clear',list);
            }  
        },
    },
    components: {
        artList
    },
}
</script>

<style scoped lang="scss">
.msg-page{ 
    padding-bottom:20rpx;
    .msg-swiper{
        width:100%;
        .slide-image{
        width:100%;
        height:100%;
        }
    }
    .data-null{
        font-size:30rpx;
        color:#ccc;
        margin-top:50rpx;
    }
}
</style>
